import $ from 'jquery'

const scrollTopLimit = 5

$('.qr-header').on('mouseenter', function () {
  $(this).addClass('qr-header--fixed')
})

$('.qr-header').on('mouseleave', function () {
  const y = document.documentElement.scrollTop
  if (y > scrollTopLimit) return

  $(this).removeClass('qr-header--fixed')
})

$(document).on('scroll', function (e) {
  const y = document.documentElement.scrollTop

  if (y > scrollTopLimit) {
    if (!$('.qr-header').hasClass('qr-header--fixed')) {
      $('.qr-header').addClass('qr-header--fixed')
    }
    return
  }

  if ($('.qr-header').hasClass('qr-header--fixed')) {
    $('.qr-header').removeClass('qr-header--fixed')
  }
})
